<template>
  <el-menu
    :default-active="defActive"
    class="el-menu-vertical-demo"
    style="height: 600px;"
    router
  >
    <el-menu-item index="/user/account" >
      <i class="el-icon-user"></i>
      <span slot="title">我的账号</span>
    </el-menu-item>
    <el-menu-item index="/user/pwd">
      <i class="el-icon-key"></i>
      <span slot="title">修改密码</span>
    </el-menu-item>
    <el-menu-item index="/user/security">
      <i class="el-icon-chat-square"></i>
      <span slot="title">修改密保</span>
    </el-menu-item>
  </el-menu>

</template>

<script>
export default {
  name: 'SelfMenu',
  data () {
    return {
      defActive: '/user/account'
    }
  },
  mounted () {
    this.setDefActive()
  },
  methods: {
    setDefActive() {
      const fullPath = this.$route.fullPath
      if (fullPath.indexOf('/user/pwd') >= 0) {
        this.defActive = '/user/pwd'
      }else if(fullPath.indexOf('/user/security') >= 0){
        this.defActive = '/user/security'
      }else if(fullPath.indexOf('/user/account') >= 0){
        this.defActive = '/user/account'

      }
    }
  }
}
</script>

<style scoped>

</style>
